@import './theme/custom-variables.scss';
@import './page/premission/index.scss';
// a链接的颜色
a {
  color: var(--main-color);
  text-decoration: none;
}

// 整体内容布局样式
.left-fixed-right-auto {
  padding-top: 60px;
  height: 100%;
  .content-page {
    overflow: auto;
    &.card-layout {
      padding: 20px;
    }
  }
}

// 右边浮动
.pull-right {
  float: right;
}

// 左边浮动
.pull-left {
  float: left;
}

// 右对齐
.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

// 自定义的按钮样式
.el-button.custom-button {
  background-color: transparent;
  color: #fff;
  &:hover {
    background-color: transparent;
  }
}

// 自定义滚动条的样式
.custom-scrollbar {
  &::-webkit-scrollbar {
    width: 4px;
  }

  &::-webkit-scrollbar-track {
    background-color: transparent;
  }

  &::-webkit-scrollbar-thumb {
    border-right: 2px solid #cecece;
    border-left: 2px solid #cecece;
    border-top: 2px solid #cecece;
    border-bottom: 2px solid #cecece;
    border-radius: 2px;
    background-color: #cecece;
    -webkit-transition: background .3s;
  }

  &::-webkit-scrollbar-thumb:hover {
    border-color: #cecece;
    background-color: #cecece;
  }

  &.hover::-webkit-scrollbar-thumb {
    border-color: transparent;
    background-color: transparent;
  }
}

// 自定义表头样式
tr.custom-table-header th {
  background-color: #F5F7FA;
  color: #1F2D3D;
}
tr.custom-table-header-gray th {
  background-color: #F5F7FA;
  color: #303133;
}
// 深灰样式
tr.custom-table-header-dark-gray th {
  background-color: #E0E6ED;
  color: #606266;
}
// 自定义分页器的样式
.el-pagination {
  text-align: center;
  margin: 20px 0;
}


// 自定义文字按钮颜色
.el-button--text.warning {
  color: #F7B32A;
}
.el-button--text.error {
  color: var(--error-color);
}

// 自定义标题
.title-module {
  font-size: 18px;
  color: #1F2D3D;
  padding: 20px 0;
}

// 自定义文字颜色
.warn-text {
  color: var(--warning-color);
}

.error-text {
  color: var(--error-color);
}

.main-text {
  color: var(--main-color);
}

// 最多显示一行
.one-lien {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
// 最多显示两行
.two-line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.el-button.is-plain {
  background: none;
  color: #fff;
  &:hover,
  &:focus {
    background: none;
    color: #fff;
    border-color: #fff;
    opacity: 0.37;
  }
  &.is-disabled {
    background: none;
    border-color: rgb(209, 218, 229);
    color: rgb(191, 202, 217);
    opacity: 0.3;
  }
  &.el-button--text {
    border: none;
  }
}


